<script setup>

import {ref} from "vue";
import {baseUrl, reqInstance} from "@/utils/request/index.js";
import {message} from "ant-design-vue";
import dayjs from "dayjs";
import {useLoginStore} from "@/sotre/useLoginStore.js";

const visible = ref(false)

const emit = defineEmits(['archive-completed'])

const users = ref([])
const getUsers = async () => {
  try {
    const res = await reqInstance({
      url: "/user/all",
      method: "get",
    })
    users.value = (res.data?.data ?? []).map((item) => {
      return {
        value: item.user_id,
        label: item.name
      }
    })
  } catch (e) {

  }
}

const formData = ref({
  attachment: "",
  contract_no: "",
  tech_user_ids: [],
})

let contract_id = 0
let year = 0
const fileList = ref([]);

const openDraw = (data) => {
  contract_id = data.id
  year = dayjs.unix(data.sign_date).year()
  formData.value.contract_no = data.contract_no
  formData.value.attachment = data.attachment
  formData.value.tech_user_ids = data.contract_users.filter((item) => item.user_type === 1).map(item => item.user_id)
  fileList.value = []
  if (!!data.attachment) {
    fileList.value.push({
      uid: '2',
      name: data.attachment,
      status: 'done',
      url: baseUrl + "/" + data.attachment,
    })
  }
  getUsers()
  visible.value = true
}
const headers = {
  Authorization: useLoginStore().token,
};
const handleChange = info => {
  if (info.file.status !== 'uploading') {
    console.log(info.file, info.fileList);
  }
  if (info.file.status === 'done') {
    formData.value.attachment = info.file.response
    message.success(`文件上传成功`);
  } else if (info.file.status === 'error') {
    message.error(`文件上传失败`);
  }
};

const doSave = async (saveType) => {
  try {
    await reqInstance({
      url: "contract/archive/" + contract_id,
      method: "put",
      data: formData.value
    })
    emit('archive-completed')
    visible.value = false
    message.success("保存成功")
  } catch (e) {

  }
}
const getContractNo = async () => {
  try {
    const res = await reqInstance({
      url: "contract/get-no?year="+year,
      method: "get",
    })
    formData.value.contract_no = res.data
  } catch (e) {

  }
}
defineExpose({openDraw})
</script>

<template>
  <a-drawer
      v-model:open="visible"
      class="custom-class"
      root-class-name="root-class-name"
      :root-style="{ color: 'blue' }"
      style="color: red"
      title="合同归档"
      placement="right"
  >
    <a-form layout="vertical" :model="formData">
      <a-form-item prop="com_name" label="档案编号">
        <a-input v-model:value="formData.contract_no" placeholder="请输入档案编号"  style="width: calc(100% - 200px)"/>
        <a-button @click="getContractNo">生成</a-button>
      </a-form-item>
      <a-form-item label="技术负责人">
        <a-select mode="multiple" v-model:value="formData.tech_user_ids" :options="users"></a-select>
      </a-form-item>
      <a-form-item label="合同附件（归档）">
        <a-upload
            v-model:file-list="fileList"
            name="file"
            :max-count="1"
            :action="baseUrl + '/file'"
            :headers="headers"
            @change="handleChange"
        >
          <a-button>
            <upload-outlined></upload-outlined>
            点击上传
          </a-button>
        </a-upload>
      </a-form-item>
        <a-form-item>
          <a-button type="primary" @click="doSave">保存</a-button>
        </a-form-item>
    </a-form>
  </a-drawer>
</template>

<style scoped>

</style>